<template>
  <div>
    <ul class="oul">
      <li v-for="item in list" :key="item.id"
      @click="pushDetail(item.id,item.title)"
      >
      {{item.title}}
      </li>
    </ul>

  </div>
</template>

<script>
import axios from 'axios'

export default {
  data() {
    return {
      list: []
    }
  },
  created() {
    //请求接口对list赋值
    axios.get('/getList').then(res => {
      this.list = res.data
      console.log(res);
    })
  },
  methods: {
    pushDetail(id,title) {
      // this.$router.push("/detail?id=" + id)
      //路由传参推荐
      this.$router.push({
        path: '/detail',
        // url可见(query)
        query:{
          id,
          title
        }
      })
    }
  },
}
</script>

<style>
.oul li{
  line-height: 46px;
}
</style>